<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Profile</title>
<link rel="stylesheet" type="text/css" href="styles.css"/>
</head>

<body>
<!-----------------------HEADER------------------------------------------------->
<div id="top">
<div class="banner">
    	<div class="logo">
        	<img src="images/logo1.png" />
        </div>
        <div class="top-tab">
        	<div class="top-tab-inactive">
                <div class="top-tab-txt">
                    <a href="MyPhotos.html"> My Photos</a>
                </div>
            </div>
        </div>
        <div class="top-tab">
        	<div class="top-tab-inactive">
                <div class="top-tab-txt">
                    <a href="Explore.html"> Explore</a>
                </div>
            </div>
        </div>
        
		<div class="upload">
        	<a href="UpLoad.html">Upload</a>
        </div>
        
        <div class="search">
        	<div class="search-form">
            	<form id="search-form" method="get" action="/lh/view" name="search-form">
					<input id="search" type="text" value="" maxlength="128" size="25" name="q">
	                <input class="search-button" type="submit" value="Search">
                </form>
            </div>
        </div>
    </div>
</div>
<!-----------------------CONTENT------------------------------------------------->
<div style="overflow:hidden; width:1124px; min-height:500px; margin:auto; margin-bottom:40px;">
<div class="info-right">
    <div style="overflow:hidden; float:right; margin-top:30px; border:#CCCCCC 1px solid; border-radius:2px;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);">
        <div class="avt-profile" style="width:200px; min-height:200px; float:right;">
            <img src="images/avt-profile.gif" style="margin:3px;"/>
        </div>
        <div class="edit-avt" role="button">Change Profile Photo</div>
	</div>
    
	<div class="basic-header fr">
    	<div>
            <div class="edit">
                <a class="editButton" href="#">Edit</a>
            </div>
            <div>
            	<h2>Basic Info</h2>
            </div>
        </div>
        
        <div class="frmEdit">
            <div class="edit-name">
                <div class="label">User Name</div>
                <div class="data">hyendha</div>
            </div>
            <div class="clear line"></div>
            <div class="edit-name">
                <div class="label">Email</div>
                <div class="data">hyendha@gmail.com</div>
            </div>
			<div class="clear line"></div>
            <div class="edit-name">
                <div class="label">Gender</div>
                <div class="data">Female</div>
            </div>
            <div class="clear line"></div>
            <div class="edit-name">
                <div class="label">Birth Date</div>
                <div class="data"></div>
            </div>
        </div>
    </div>
    
    <div class="basic-header fr">
    	<div>
            <div class="edit">
                <a class="editButton" href="#">Edit</a>
            </div>
            <div>
            	<h2>Work and Education</h2>
            </div>
        </div>
        
        <div class="frmEdit">
            <div class="edit-name">
                <div class="label">College</div>
                <div class="data">HUST</div>
            </div>
            <div class="clear line"></div>
            <div class="edit-name">
                <div class="label">High School</div>
                <div class="data">HH2</div>
            </div>
        </div>
    </div>
</div>

<div class="info-left">
    <div class="seCute">
        <div class="profile-name">
            <a class="nameButton" role="button" href="EditProfile.html">Hoang Yen</a>
        </div>
        <img src="images/SeCute.png" style="float: right; margin-top: 50px;" />
    </div>
</div> 
</div>

<div id="footer">
	<p id="copyright"> Powered by 4nSE, SE K53, Hanoi University of Science and Techonogy.</p>
</div>

</body>
</html>
